// 引入three
import * as THREE from "three";
// 引入控制器
import { OrbitControls } from "three/addons/controls/OrbitControls.js";
// 引入控制面板
// import GUI from "lil-gui";
// 引入动画库
// import * as TWEEN from "@tweenjs/tween.js";
export default {
  init (el) {
    // 1. 创建场景对象Scene
    const scene = new THREE.Scene();
    /**
     * 3.创建相机并设置
     */
    // 获取盒子
    const container = document.getElementById(el);
    // 创建相机
    const camera = new THREE.PerspectiveCamera(
      60,
      container.clientWidth / container.clientHeight,
      0.04,
      3000
    );

    camera.lookAt(0, 0, 0);
    /**
     * 4.创建渲染器对象
     */
    const renderer = new THREE.WebGLRenderer({
      antialias: true,
    });
    // 设置渲染器的宽高为盒子的宽高
    renderer.setSize(
      container.clientWidth,
      container.clientHeight
    );
    // 添加渲染器到盒子中
    container.appendChild(renderer.domElement);

    //5.创建控件对象 没有这个就不能缩放拖拽
    let controls = new OrbitControls(
      camera,
      renderer.domElement
    )
    return { scene, camera, renderer, controls }
  }
}